<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="./images/logo.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="./css/goodDetail.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/layui.css">
    <title>商品详情</title>
</head>
<body>
<!--公共头部-->
<div class="headerwrap clears bord-bott2">
    <div class="headnav">
        <div class="headnav-cent">
            <div class="headnav-left l">
                <p class="headnav-left-download">
                    <span class="headnav-left-img"></span>
                    <span class="headnav-left-text">分享实地圈</span>
                </p>
                <p></p>
            </div>

            <div  class="headnav-right r">
                <ul class="headnav-right-ul r">
                    <li class="show pleaseLogin"><a href="./login.html" class="bordRight1c">您好，请登录</a></li>
                    <li class="hide hasLogin"><a id="username"  class="" href="">kewei</a><span class="line"></span><a class="bordRight1c" id="loginOut" href="">退出</a></li>
                    <li class="hide"><a  class="bordRight1c" href="javascript:void(0)">返回首页</a></li>
                    <li class="my_sdq"><a class="bordRight1c" href="javascript:void(0)">我的实地圈<span class="headnav-arrow"></span></a></li>
                    <li class="my_collect"><a class="bordRight1c" href="javascript:void(0)">我的收藏</a></li>
                    <li class="down-app">
                        <span class="headnav-left-img"></span>
                        <span class="headnav-left-text">手机实地圈</span>
                        <span class="headnav-left-arrow"></span>
                        <div class="head-app-down hide">
                            <img src="./images/appcode.png" alt="">
                        </div>
                    </li>
                    <div class="clears"></div>
                </ul>

            </div>
            <div class="clears"></div>
        </div>
    </div>
    <div class="headAdvert hide">
        <div class="headAdvert-img">
            <span>X</span>
            <img src="./images/advert.png" alt="">    
        </div>
    </div>
    <div class="pubtopwrap">
        <div class="pubwrap">
            <div class="pubtopcon">
                <div class="logo"></div>
                <div class="changecity">
                    <span id="currentCity" class="col333">深圳</span>
                    <a href="javascript:void(0)" class="col37c">切换城市</a>
                </div>
                <div class="pubsearch setbox_s bgfff">
					<div class="searchMenu">
						<div class="searchTab bgfff">
							<ul class="tab-ul">
								<li data-tag="1" class="bgco36">商品</li>
								<li data-tag="2" class="bgcoff">商家</li>
								<li data-tag="3" class="bgcoff">服务</li>
							</ul>
						</div>
						<i></i>
					</div>
					<input type="text" class="searchinp col333" placeholder="请输入商品名">
					<a href="javascript:void(0);" class="searcha colfff bg2fb">搜索</a>
					<div class="nearArea">
                        <ul class="l">
                            <li><a href="">肯德基</a></li>
                            <li><a href="">汤粉</a></li>
                            <li><a href="">KTV</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li class="clears"></li>
                        </ul>
					</div>
				</div>
                <div class="clears"></div>
            </div>
            <div class="clears"></div>
            <nav class="classifynav ">
                  <!--这里显示分类-->
                <div class="cont_body_nav setbox_s l">
                    <ul class="goods_nav">
                        <li class="goods_nav_li l">日用市场</li>
                       
                    </ul>
                    <div class="goods_nav_kid hide">
                        <ul class="nav_kid">
                            <li class="nav_kid_li l">日用市场</li>
                            
                        </ul>
                    </div>
                </div>
                <span class="colfff nav_down">商品分类<i></i></span>

                <ul>
                    <li data-links="index" class="link_index jump_links">
                        <a href="javascript:void(0);" class="col333">首页</a>

                    </li>
                    <li data-links="goods" class="link_goods jump_links">
                        <a href="javascript:void(0);" class="col37c">商品</a>
                    </li>
                    <li data-links="shop" class="link_shop jump_links">
                        <a href="javascript:void(0);" class="col333">商家</a>
                    </li>
                    <li data-links="service" class="link_service jump_links">
                        <a href="javascript:void(0);" class="col333 ">服务</a>
                    </li>
                </ul>
                <div class="nav-img hide">
                    <img src="./images/appcode.png" alt="">
                </div>
            </nav>
        </div>
    </div>
</div>
<!--商品详情-->
<div id="zwl-serviceDetail">
    <div class="service-level">
        <p>
            <span>商品</span>
            <span class="levelr">></span>
            <span class="levelr typeName">店铺</span>
        </p>
    </div>
    <div class="serviceDetail">
        <div class="service-intro">
            <div class="info">
               <div class="detailsl" id="preview">
                    <div class="jqzoom" id="spec-n1" onClick=""><img height="400" src="./images/loading.gif" jqimg="./images/loading.gif" width="400">
                    </div>
                <div id="spec-n5">
                    <div class="control" id="spec-left">
                        <img src="ad/left.gif" />
                    </div>
                    <div id="spec-list">
                        <ul class="list-h">
                            <li><img src="ad/img01.jpg"> </li>
                            <li><img src="ad/img02.jpg"> </li>
                        </ul>
                    </div>
                    <div class="control" id="spec-right">
                        <img src="ad/right.gif" />
                    </div>	
                </div>
            </div>
            <div class="intro">
                <p class="name-p">包子店铺</p>
                <p class="intro-detail">兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼</p>
                <p class="open-time">
                    <span class="open-name">价格：</span>
                    <span class="price">2.8</span><span class="unit">(斤)</span>
                </p>
                <p class="address">
                    <span class="address-name">数量：</span>
                    <span class="declare">-</span><span class="address-addr">1</span><span class="increase">+</span><span class="notice">(购买数量过多可电话咨询商家是否有货)</span>
                </p>
                <p class="intro-contact"><span class="contact">联系方式：</span><span class="contact-phone">15874709296</span><span class="linkman">立即购买</span></p>

                <span class="intro-collected">
                    <span class="collect-sc"><span class="img"></span>收藏量：<span class="count coll-count">120</span></span>
                    <span class="collect-ll"><span class="img"></span>浏览量：<span class="count view-count">120</span></span>
                    <span class="collect-log"><span class="img1 un-collect"></span><span class="count1">收藏</span></span></span>
                <!--商家服务-->
                <div class="shopService">
                   <!--配送 支付 可开发票-->
                    <div class="shopService-tag">
                        <span class="shopTag">商家服务：</span>   
                    </div>
                    <!--其他的标签-->
                    <div class="tagDetail">
                        
                    </div>
                </div>
            </div>
          </div>
            <div class="bar">
               <a href="#shop-pos" class="serviceDetail-name shopName bgf38d"><span>商家位置</span></a>
                <a href="#pro-detail" class="serviceDetail-name shopIntro bgf666"><span>商品详情</span></a>
                 <a href="#shop-reg" class="serviceDetail-name shopRe bgf666"><span>商家认证</span></a>
                 <a href="#into-shop" class="serviceDetail-name goIn bgf666"><span>进入店铺</span></a>

            </div>
            <p><a class="biaoti" name="shop-pos" id="shop-pos">商家位置</a></p>
            <div class="shopAddress">
                <div class="map l">
                    <div class="map-pic" id="map-pic"></div>
                    <div class="map-word">查看完整地图</div>
                </div>
                <div class="shop-addr-info l">
                    <h3 class="name-p">包子店铺哈哈哈</h3>
                    <p class="shop-addrs"><lable>地址：</lable><span>清湖地铁c出口356花园</span></p>
                    <p class="shop-phone"><lable>联系方式：</lable><span class="phone-number">15580915321</span><span class="buy-product">立即购买</span></p>
                    <a href="./businesslog.html" target="_blank" class="app-download"><i></i><span>下载app,查看更多精彩</span></a>
                </div>
                <div class="clears"></div>
            </div>
            <p><a class="biaoti" name="pro-detail" id="pro-detail">商品详情</a></p>
           <div class="serviceDetail-intro"></div>
           <div class="zwlshop-pic hide">
               <img src="./images/124.png" alt="">
           </div>
           <p><a name="shop-reg" id="shop-reg" class="biaoti">商家认证</a></p>
           <div class="reg-pic">
               <div class="pic-img"></div>
               <div class="pic-img"></div>
               <div class="pic-img"></div>
               <div class="pic-img"></div>
           </div>
           <div class="shop-page">
               <div id="page" class="page"></div>
           </div>
           <div class="clears"></div>
        </div>
        <div class="guess hide">
            <div class="guess-like">
                <hr class="hr1 ">
                <span>
                 猜你喜欢
                 </span>
                <hr class="hr2 ">
                <div class="guess-pic">
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="page">
                         <span class="forward-b"></span>
                         <span class="forward-t"></span>
                     </div>
                </div>
            </div>

            <div class="guess-like-ta">
                <hr class="hr1 ">
                <span>
                 TA的服务
                 </span>
                <hr class="hr2 ">
                <div class="guess-pic">
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                      <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <di
                        v class="page">
                         <span class="forward-b"></span>
                         <span class="forward-t"></span>
                     </div>
                </div>

        </div>
    </div>
    <div class="zwl-shop">
            <div class="pic-header">
                <img src="./images/124.png" alt="">
            </div>
            <div class="zwl-shopName">湖北大米大米大米大米店</div>
            <a name="into-shop" id="into-shop" class="shop-go">进入店铺</a>
        </div>
    <div class="shopping">
        <ul class="productList">
        </ul>
    </div>
    <div class="clears"></div>
</div>
<!--底部-->
<div class="index_footer">
    <div id="zwl-footer">
        <div class="detail ">
            <ul class="detail-ul">
                <li class="detail-li1">
                    <div class="detail-div3">
                        <p class="detail-div-head text-left">用户帮助</p>
                        <a href="#" class="detail-div-son son1">常见问题</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div">
                        <p class="detail-div-head text-right">手机实地圈</p>
                        <a href="#" class="detail-div-son">下载手机版</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">商户合作</p>
                        <a href="#" class="detail-div-son">友情链接</a>
                        <a href="#" class="detail-div-son">市场合作</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">公司信息</p>
                        <a href="#" class="detail-div-son text-right">关于实地圈</a>
                        <a href="#" class="detail-div-son text-right">微信公众号</a>
                        <a href="#" class="detail-div-son text-right">新浪微博</a>
                    </div>
                </li>
                <li class="detail-li1 detail-li2">
                    <div>
                        <div class="detail-div2">
                        <p class="detail-div-head text-right head2">联系方式</p>
                        <a href="#" class="detail-div-son text-right">电话：400-886-7938</a>
                        <a href="#" class="detail-div-son text-right">周一至周日:</a>
                        <a href="#" class="detail-div-son text-right">9:00-22:00</a>
                    </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="log">
            ©2016 shidiquan.cn  京ICP证030173号  京公网安备11010802014106号  互联网药品信息
        </div>

</div>
<!--侧边栏选项-->
<div class="index_side">
        <div class="s_div s_back_top">
            <p class="s_wid_back hide">
                <i>回到顶部</i>
                <span></span>
            </p>
            <span class="s_bg s_bg_back hide">
                <span></span>
                <i>
                    返回  
                    顶部
                </i>
            </span>
        </div>
        <div class="s_div s_down">

            <p class="s_wid_down hide">
               <span>扫描二维码</span>
                <img src="./images/appcode.png" alt="">
            </p>
            <span class="s_bg s_bg_down">
                <span></span>
                <i>
                   下载
                   app
                </i>
            </span>
        </div>
    </div>
<!--登录弹出框提示信息-->
<div id="loginBox">
    <div id="loginBody" class="loginBody">
    </div>
    <div class="login">   
        <div class="login-detail">
            <i class="closeBtn"></i>
            <span class="login-log col141 font16">请先登录</span>
            <div class="login-l login-name">
                <div class="login-user l"></div>
                <input placeholder="手机号/实地圈号登录" class="login-input font14 ">
            </div>
            <div class="login-l login-pwd">
                <div class="login-user lr l"></div>
                <input type="password" placeholder="请输入密码" class="login-input font14 ">
            </div>
            <div class="auto">
                <input class="auto-login l" type="checkbox" name="checkbox"  value="login" /> <span class="auto-span a_login l">记住密码</span><span class="auto-span l text-right">忘记密码?</span>
            </div>

            <div class="loginIn colfff ">
                登录
                <div class="error">账号或者密码不能为空!</div>
            </div>
            <span class="download font12 col36c">下载手机APP注册</span>
        </div>
    </div>
</div>
</body>
<script src="./js/jquery-1.7.2.min.js"></script>
<script src="./js/common.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=A2DaAspWaAq1kmdyfgD2TBmWuxxfyOMn"></script>
<!--分页-->
<script src="./js/layui.js"></script>
<script src="./js/base.js"></script>
<script src="./js/163css.js"></script>
<script src="./js/lib.js"></script>
<script src="./js/jquery.lazyload.js"></script>
<script src="./js/md5.js"></script>
<script>
;(function(){
    layui.use(['laypage', 'layer'], function(){
      var laypage = layui.laypage
      ,layer = layui.layer;
      laypage({
        cont: 'page',
          pages: 60,
          skip: true,
          first:false,
          lase:false,
          jump: function(obj, first){
            var curr = obj.curr;
                console.log(curr);
          }
      });
    });
    
    var nums=parseInt($(".address-addr").html());
    //点击增加
    $(".increase").on("click",function(){
        nums+=1;    
        $(".address-addr").html(nums);
    });
    //点击减少
    $(".declare").on("click",function(){
        if(nums>1){
            nums-=1; 
        }  
        $(".address-addr").html(nums);
    });
    //-----点击改变背景字体颜色------
    $(".serviceDetail-name").on("click",function(){
        $(this).addClass("bgf38d").removeClass("bgf666").siblings().addClass("bgf666").removeClass("bgf38d");
    });
    $(".nav_down").on("click",function(){
            if($(".goods_nav").css("display")=="none"){
                $(".goods_nav").css("display","block");
                $(".classifynav .nav_down i").css("background","url(./images/pubbg.png) no-repeat 0 -168px");
            }else{
                $(".goods_nav").css("display","none");
                $(".classifynav .nav_down i").css("background","url(./images/pubbg.png) no-repeat 0 -120px");
            }
            
            setAction(".goods_nav",".goods_nav_kid");//服务
        });
    function setAction(ele,_ele){
        var ele=ele;
        var _ele=_ele;
        $(ele).find("li").on("mouseover",function(){
            var a=$(this).html();
            $(_ele).addClass("show").removeClass("hide");
            var test='<li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li><li class="">'+a+'</li>';
            $(_ele).find(".nav_kid").html(test);
        });
        $(ele).on({//大类鼠标停留跟移除
            mouseover:function(){
                show_action();
            },
            mouseout:function(){
                hide_action();    
            }
        });
        $(_ele).find(".nav_kid").on({//小类鼠标停留跟移除
            mouseover:function(){
                show_action();
            },
            mouseout:function(){
                hide_action();
            }
        });
        function show_action(){
            $(_ele).addClass("show").removeClass("hide");
        }
        function hide_action(){
            $(_ele).addClass("hide").removeClass("show");
        }
        $(document).on("click",_ele+" ul li",function(){//选择小类并且隐藏，跳转到指定的页面
            $(_ele).addClass("hide").removeClass("show");
            $(ele).css("display","none");
            if($(ele).css("display")=="none"){
                $(".classifynav .nav_down i").css("background","url(../images/pubbg.png) no-repeat 0 -120px");
            }
            $(".selected").css("display","block");
        });     
    }
    
    /**
     *判断class为bar的div当前位置
     **/
    var top_bar=parseInt($(".bar").offset().top);//class为bar的div的位置
    getBarPosition();
    function getBarPosition(){
        var topWindow=parseInt($(document).scrollTop());
        if(top_bar<=topWindow){
            $(".bar").addClass("scrollBar");
        }else{
            $(".bar").removeClass("scrollBar");
        }
    }
    $(document).on("scroll",function(e){
        getBarPosition();
    });
})();
</script>
<script src="./js/page/goodDetail.js"></script>
<script src="./js/jqzoom.js"></script>
<script src="./js/jumpPage.js"></script>
</html>